{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: BUSL-1.1
}}

{{#if (and this.controlGroupResponse.token this.controlGroupResponse.uiParams.url)}}
  <div class="control-group-success" data-test-navigate-message>
    You have been granted access to
    <code>{{this.model.requestPath}}</code>. Be careful, you can only access this data once. If you need access again in the
    future you will need to get authorized again.
    <div class="box is-shadowless is-fullwidth is-marginless has-slim-padding">
      <Hds::Button @text="Visit" data-test-navigate-button {{on "click" (action (perform this.markAndNavigate))}} />
    </div>
  </div>
{{else}}
  {{#if this.unwrapData}}
    <div class="control-group-success is-editor">
      <div class="is-relative">
        <JsonEditor
          data-test-json-viewer
          @showToolbar={{false}}
          @value={{stringify this.unwrapData}}
          @readOnly={{true}}
          {{! ideally we calculate the "height" of the json data, but 100 should cover most cases }}
          @viewportMargin="100"
          @gutters={{false}}
          @theme="hashi-read-only auto-height"
        />
        <Hds::Copy::Button
          @text="Copy"
          @isIconOnly={{true}}
          @textToCopy={{stringify this.unwrapData}}
          @onError={{(fn
            (set-flash-message "Clipboard copy failed. The Clipboard API requires a secure context." "danger")
          )}}
          class="transparent top-right-absolute"
        />
      </div>
    </div>
    <div class="field is-grouped box is-fullwidth is-bottomless">
      <Hds::Button
        @text="Back"
        @color="secondary"
        @route="vault.cluster.access.control-groups"
        @icon="chevron-left"
        @iconPosition="leading"
      />
    </div>
  {{else}}
    <div class="control-group-success" data-test-unwrap-form>
      <form {{action (perform this.unwrap this.token) on="submit"}}>
        <MessageError @errorMessage={{this.error}} />
        <p>
          If you have the token, you can now can access
          <code>{{this.model.requestPath}}</code>
        </p>
        <label for="token" class="is-label">
          Token to access data
        </label>
        <div class="control">
          <Input
            data-test-input="token"
            class="input"
            autocomplete="off"
            spellcheck="false"
            name="token"
            id="token"
            @value={{this.token}}
          />
        </div>
        <div class="field is-grouped box is-fullwidth is-bottomless">
          <Hds::Button @text="Access" data-test-unwrap-button type="submit" disabled={{not this.token}} />
        </div>
      </form>
    </div>
  {{/if}}
{{/if}}